<template>
  <view class="p-34 position-relative">
    <view v-if="!userInfo.mobile" class="position-absolute left-0 top-0"
      style="width: 100%; height: 100%; z-index: 9999" @click="login.open()"></view>
    <uv-navbar title="定制" placeholder leftIcon=" " :autoBack="true"></uv-navbar>
    <view class="m-x-10" style="border-radius: 12rpx; overflow: hidden">
      <uv-swiper :list="bannerList" keyName="image" @click="
        (e) => {
          swiperClick(bannerList[e]);
        }
      " indicator height="1022rpx" radius="12rpx"></uv-swiper>
    </view>
    <view class="m-y-36" @click="getAlreadyCapped">
      <uv-image :src="ASSETSURL + 'btn1.png'" width="686rpx" height="118rpx"></uv-image>
    </view>
  </view>
  <tabbar :number="number"></tabbar>
  <dy-login ref="login"></dy-login>
  <alreadyCapped ref="alreadyCappeds"></alreadyCapped>
</template>

<script setup>
import { ref, onMounted, reactive, nextTick, watch } from 'vue';
import { onReachBottom, onShow, onReady, onLoad, } from '@dcloudio/uni-app';
import { ShopCenterApi } from '../../api/serves';
import { useCounter } from '@/mixins/userHooks.js';
import store from '@/store';
const { getUserInfo, userInfo, tool } = useCounter();
const number = ref(2);
const bannerList = ref([]);
const login = ref(null);
const alreadyCappeds = ref(null);
onLoad((ope) => {
  if (ope.share_id) {
    store.commit('setShareId', ope.share_id);
  }
});

onShow(() => {
  console.log(tool.storage('userInfo'), 'getUserInfogetUserInfogetUserInfo');
  getbanner();
});
// onMounted(() => {
//   
// });
// watch(
//   () => [alreadyCappeds.value],
//   (newVal, oldVal) => {
//     console.log(newVal, '=============');
//   },
//   {
//     immediate: true
//   }
// );
// 获取banner信息
const getbanner = async () => {
  try {
    let { code, data, msg } = await ShopCenterApi.getBanner2({ number: 1 });
    console.log(data, '===========');
    bannerList.value = data;
  } catch (error) {
    console.log(error, '====errorerror=======');
  }
};

const goPages = (url) => {
  uni.navigateTo({
    url
  });
};
const getAlreadyCapped = () => {
  if (userInfo.value.my_diy < 10) {
    goPages('/packageDiy/diyIndex/diyIndex')
  } else {
    alreadyCappeds.value.open();
  }
}
</script>

<style lang="scss" scoped></style>
